<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:f="http://java.sun.com/jsf/core"      
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:p="http://primefaces.org/ui">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>All About My Book</title>
<link href="${criarPaginaLivroBean.linkCssLayoutPagina}" rel="stylesheet" type="text/css" />
<style type="text/CSS">

</style>

</h:head>
<body>
<f:view>
	<body>
    <h:form>
    
    <p:wizard>
    
    
    
      
    
    
    <p:tab id="livro" title="livro">
    	
    	<p:panel header="detalhes do livro" style="background-color='blue';">
    	<p:messages/>
    	
    	<h1>Projeto All about my book</h1>
    
      	<p style="text-align:center;"> bem vindo! aqui você pode criar um site pessoal para o livro que você quer divulgar! 
        É simples: basta você preencher o formulário abaixo</p> 
    	<h:panelGrid columns="2">
       Título do livro: 
      <h:inputText size="40" required="true" requiredMessage="campo obrigatorio: titulo livro" value="#{criarPaginaLivroBean.tituloDoLivro}"></h:inputText> 
    
       Descrição do livro(para a página inicial):
      <h:inputTextarea name="descricaoLivro" cols="40" rows="4" value="#{criarPaginaLivroBean.descricaoLivro}"></h:inputTextarea>
      
    
      site para comprar livro(se existe):
       <h:inputText size="40" value="#{criarPaginaLivroBean.linkSiteParaComprarLivro}"></h:inputText> 
    	</h:panelGrid>
    	
    	</p:panel>
    </p:tab>
    
    <p:tab id="layout" title="layout">
    	<p:panel header="detalhes do layout">
    	<p:messages/>
    	Layout da página: 
     
     
      		<h:selectOneRadio  value="#{criarPaginaLivroBean.linkCssLayoutPagina}"> 
      			<f:selectItem  itemValue="CSS/bodyEstiloRed.css" itemLabel="layout1"></f:selectItem>
      			<f:selectItem  itemValue="CSS/bodyEstiloBlue.css" itemLabel="layout2"></f:selectItem>
      		</h:selectOneRadio> 
      
      
    <h:panelGrid columns="2">
       Exemplo layout1: 
     
      
      		 
      			<img src="CSS/images/paginaautenticacaodesignphillip.png" /><br />
      
      
   
       Exemplo layout2: 
     
     
      		 
      			
      		<img src="CSS/images/paginaautenticacaodesignandrews.png" />
      
      
    </h:panelGrid>
    	</p:panel>
    </p:tab> 
    
    <p:tab id="login" title="login">
    	<p:panel header="detalhes do login">
    	<h:messages/> 
    
       Autenticação do autor da página(você vai precisar dela para mudar seu web site)
    
    <h:panelGrid columns="2">
      <h:outputText value="Nome de usuário:"></h:outputText>
       <h:inputText size="40" value="#{criarPaginaLivroBean.usuario}" required="true" requiredMessage="campo obrigatório para preenchimento:usuario">
      								  </h:inputText> 
      								  
      <h:outputText value="Senha:"></h:outputText>
       <h:inputText size="40" id="campoCriarUsuarioSenha" value="#{criarPaginaLivroBean.senha}" required="true" requiredMessage="campo obrigatório para preenchimento:senha">
      								 <f:validator validatorId="validadorSenhaEstaCorreta" />
      								  
       </h:inputText>
       <p:tooltip for="campoCriarUsuarioSenha" targetPosition="topRight" value="senha deve conter número(s) e ter, no mínimo, 8 dígitos" showEffect="fade" hideEffect="fade" />
          
    
    </h:panelGrid> <br />
       <h:commandButton action = "#{criarPaginaLivroBean.criarPaginaLivro}" value="criar página"></h:commandButton>
    
   
    	</p:panel>
    </p:tab>
    
    
    </p:wizard>
    </h:form>
   
   

  </body>
</f:view>
</body>
</html>